<script setup lang="ts">
import { ref } from "vue";
import type { FormModel } from "./FormComponentMixin";
import FormDefEdit from "./FormDefEdit.vue";

const formData = defineModel<FormModel>("formData");

const formDefRef = ref();

defineExpose({ validate });

function validate() {
  return formDefRef.value.validate();
}
</script>

<template>
  <el-main class="designer-base">
    <FormDefEdit ref="formDefRef" v-model:formData="formData" />
  </el-main>
</template>

<style lang="scss" scoped>
.designer-base {
  width: 950px;
  min-height: calc(100vh - 160px);
  height: 100%;
  margin: 0 auto;
  background-color: white;
  padding: 10px;
  border-radius: 5px;
  overflow-x: hidden;
}
</style>
